var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');

const GAME_STATE_TITLE = 0;
// const GAME_STATE_NEW_GAME;
// const GAME_STATE_NEW_LEVEL = 1;
// const GAME_STATE_PLAYER_START;
const GAME_STATE_PLAY_LEVEL = 1;
// const GAME_STATE_PLAYER_DIE;
const GAME_STATE_GAME_OVER = 2;


var currentGameState = 0;
var currentGameStateFunction = null;

function switchGameState(newState) {
    currentGameState = newState;
    switch(currentGameState) {
        case GAME_STATE_TITLE:
            currentGameStateFunction = gameStateTitle;
            break;
        case GAME_STATE_PLAY_LEVEL:
            currentGameStateFunction = appStatePlayLevel;
            break;
        case GAME_STATE_GAME_OVER:
            currentGameStateFunction = gameStateGameOver;
            break;
    }
}

function gameStateTitle(){

}

function runGame(){
    currentGameStateFunction();
}

function appStatePlayLevel(){
    checkKeys();
    update();
    render();

}

function gameStateGameOver(){
}

// 按键检查
function checkKeys(){
// 推进
    if (keyPressList[38] === true) {
        var angleInRadians = rotation * Math.PI / 180;
        facingX = Math.cos(angleInRadians);
        facingY = Math.sin(angleInRadians);
        if (movingX * movingX + movingY * movingY < maxThrustAcceleration * maxThrustAcceleration) {
            movingX = movingX + thrustAcceleration * facingX;
            movingY = movingY + thrustAcceleration * facingY;
        }
    } else {
        // 推进键放开时，停止
        movingX = 0;
        movingY = 0;
    }

    // 逆时针旋转
    if (keyPressList[37] === true) {
        rotation -=rotationalVelocity;
    }

    // 顺时针旋转
    if (keyPressList[39] === true) {
        rotation += rotationalVelocity;
    }
}

function update(){
    // 检测撞墙
    if (x + movingX < canvas.width - ship.width && x + movingX > 0) {
        x = x + movingX;
    }

    if (y + movingY < canvas.height - ship.height && y + movingY > 0) {
        y = y + movingY;
    }
}

function render(){
// 绘制背景和文字
    context.fillStyle = '#000000';
    context.fillRect(0, 0, 1000, 500);
    context.strokeRect(0, 0, 1000, 500);

    context.fillStyle = '#ffffff';
    context.font = '20px sans-serif';

    context.textBaseline = 'top';
    context.fillText("player ship - static", 0, 180);
    drawShip();
}

function drawShip(){
    context.save();

    context.setTransform(1, 0, 0, 1, 0, 0);
    context.translate(x + ship.width / 2, y + ship.height / 2);
    // 形状变换
    var angleInRadians = rotation * Math.PI / 180;
    context.rotate(angleInRadians);

    context.fillStyle = 'yellow';
    // 飞船的位置编码为中心
    context.strokeStyle = 'red';
    context.beginPath();

    context.moveTo(-(ship.width / 2), - (ship.height / 2));
    context.lineTo((ship.width / 2), 0);
    context.lineTo(-(ship.width / 2), (ship.height/ 2));
    context.lineTo(0, 0);
    context.lineTo(-(ship.width / 2), - (ship.height / 2));
    context.stroke();
    context.fill();
    context.closePath();
    // 更新飞船的推进
    if (shipState) {
        // 绘制飞船推进器
        context.fillStyle = 'red';
        context.beginPath();
        context.moveTo(- ship.width / 2, 0);
        context.lineTo(- (ship.width / 8), -(ship.height / 8));
        context.lineTo(-(ship.width / 8), (ship.height / 8));
        context.lineTo(- ship.width / 2, 0);
        context.stroke();
        context.fill();
        context.closePath();
    }

    context.restore();

    //
    // rotation ++;
    // if (rotation >= 360) {
    //     rotation = 0;
    // }


    shipState = !shipState;
}


// 每秒渲染的帧率（fps）
const FRAME_RATE = 30;
var intervalTime = 1000 / FRAME_RATE;
// 飞船的状态： 0 静止， 1 推进
var shipState = 1;
var ship = {width:40, height: 40};

// 旋转角度
var rotation = 0;
// 原点(x, y)
var x = 0;
var y = 0;
// 推进
var facingX = 0;
var facingY = 0;
var movingX = 0;
var movingY = 0;
// 飞船每次选装的角度
var rotationalVelocity = 5;
// 推力加速度
var thrustAcceleration = 0.3;
// 最大推力
var maxThrustAcceleration = 10;
// 按键状态
var keyPressList = [];

(function(){
    // 启动游戏
    switchGameState(GAME_STATE_PLAY_LEVEL);
    window.setInterval("runGame()", intervalTime);
})();